/**
 * @file
 * Page Styling
 *
 * Style the markup found in page.tpl.php. Also includes some styling of
 * miscellaneous Drupal elements that appear in the $content variable, such as
 * ul.links, .pager, .more-link, etc.
 */


/*
 * Body
 */

body {
  margin: 0;
  padding: 0;
	color:#333;
	font-family: Arial, Helvetica, Verdana, sans-serif;
}

#page {
	width:960px;
}

p {
	line-height:1.35em;
}

/*
 * The skip-link link will be completely hidden until a user tabs to the link.
 * See the element-focusable rule in system.base.css.
 */

#skip-link {
  margin: 0;
}
#skip-link a,
#skip-link a:visited {
  display: block;
  width: 100%;
  padding: 2px 0 3px 0;
  text-align: center;
  background-color: #666;
  color: #fff;
}

/*
 * Header
 */

#header {
	margin:20px 0;
	padding:0;
}

#logo { /* Wrapping link for logo */
  float: left; /* LTR */
  margin: 0;
  padding: 0;
}
#logo img {
  vertical-align: bottom;
}

#name-and-slogan { /* Wrapper for website name and slogan */
  float: left;
}

#site-name { /* The name of the website */
  margin: 0;
  font-size: 2em;
  line-height: 1.5em;
}
#site-name a:link,
#site-name a:visited {
  color: #000;
  text-decoration: none;
}
#site-name a:hover,
#site-name a:focus {
  text-decoration: underline;
}

#site-slogan { /* The slogan (or tagline) of a website */
  margin: 0;
  font-size: 1em;
}

.region-header { /* Wrapper for any blocks placed in the header region */
  clear: both; /* Clear the logo */
}

#hd-right{
	float:right;
	width:600px;
}

#header #accountbar {
    background: url(../images/dotted_x.gif) repeat-x scroll left bottom transparent;
    float: right;
    margin: 0 0 20px;
    position: relative;
}

#header #accountbar ul.account-buttons {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}

#header #accountbar ul.account-buttons li {
    background: url(../images/acctbar-dotted_bg.gif) no-repeat scroll right bottom transparent;
    display: block;
    float: left;
    margin: 0;
    padding: 0 1px 0 0;
    white-space: nowrap;
}

#header #accountbar ul.account-buttons li.last { padding: 0; background: none; }
#header #accountbar ul.account-buttons li a { color: #000; display: block; padding: 4px 12px 7px 12px; float: left; } /* Padding right and left changed to 12px from 2px for the bug 115864 */
#header #accountbar ul.account-buttons li a:hover { color: #D6A847; }
#header #accountbar ul.account-buttons li a.active { background: url(/images/css/nav-on_bg.gif) repeat-x; color: #326445; }

#header #alt-nav {
    clear: right;
    float: right;
    font-size: 12px;
    text-align: right;
    white-space: nowrap;
    width: 100%;
}
#header #alt-nav ul {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}
#header #alt-nav li {
    display: inline;
    margin: 0 0 0 12px;
}
#header #alt-nav li a {
    background: url("../images/green_arrow.gif") no-repeat scroll left 45% transparent;
    color: #000000;
    padding-left: 9px;
}
#header #alt-nav li a:hover {
    color: #D6A847;
}

/*
 * Main (container for everything else)
 */

#main {
	margin:0 auto;
	padding-top: 3px;
}

/*
 * Content
 */

#content {
}

.region-highlighted {
}

.breadcrumb { /* The path to the current page in the form of a list of links */
	margin:2px 0 8px 0;
}
.breadcrumb ol {
  margin: 0;
  padding: 0;
}
.breadcrumb li {
  display: inline;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

h1 {
	font-size: 26px;
	font-weight: normal;
}
h2 {
	font-size: 20px;
	font-weight: normal;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #000;
}
h3 {
	font-size: 14px;
	font-weight:normal;
}
h4 {
	font-size: 12px;
	font-weight:normal;
}
tr.even { /* Some tables have rows marked even or odd. */
  /* background-color: #eee; */ /* Drupal core uses a #eee background */
}

tr.odd {
  /* background-color: #eee; */ /* Drupal core uses a #eee background */
}

div.messages { /* Important messages (status, warning, and error) for the user. See also the declarations in messages.css. */
  margin: 1.5em 0; /* Drupal core uses "6px 0" margin */
}
div.messages ul {
  margin-top: 0;
  margin-bottom: 0;
}

div.status { /* Normal priority messages */
}

div.warning,
tr.warning { /* Medium priority messages */
  /* border: 1px solid #f0c020; */ /* Drupal core uses: 1px solid #f0c020 */
}

div.error,
tr.error { /* High priority messages. See also the .error declaration below. */
}

.error { /* Errors that are separate from div.messages status messages. */
  /* color: #e55; */ /* Drupal core uses a #e55 background */
}

.warning { /* Warnings that are separate from div.messages status messages. */
  /* color: #e09010; */ /* Drupal core uses a #e09010 background */
}

.tabs { /* See also the tabs.css file. */
}

.region-help { /* Help text on a page */
}

.more-help-link { /* Link to more help */
}

.region-content { /* Wrapper for the actual page content */
}

ul.inline { /* List of links generated by theme_links() */
  display: inline;
  padding: 0;
}
ul.inline li {
  display: inline;
  list-style-type: none;
  padding: 0 1em 0 0; /* LTR */
}

span.field-label { /* The inline field label used by the Fences module */
  padding: 0 1em 0 0; /* LTR */
}

.item-list .pager { /* A list of page numbers when more than 1 page of content is available */
  padding: 0;
}
.item-list .pager li { /* Each page number in the pager list */
  padding: 0 0.5em;
}

.feed-icon { /* The link to the RSS or Atom feed for the current list of content */
}

.more-link { /* Aggregator, blog, and forum more link */
}

/*
 * First sidebar (on left in LTR languages, on right in RTL)
 *
 * Remember to NOT add padding or margin to your .region-sidebar-first
 * (see the layout.css file.)
 */

.region-sidebar-first {
}

/*
 * Second sidebar (on right in LTR languages, on left in RTL)
 *
 * Remember to NOT add padding or margin to your .region-sidebar-second
 * (see the layout.css file.)
 */

.region-sidebar-second {
}

/*
 * Footer
 */

#footer {
}

#footer { /*margin: 30px 0 20px 0;*/  font-size: 11px; margin:0 auto; padding: 10px 0 20px 0; width:965px; border-top: 1px solid #d0d0d0; color: #000; text-align:left; } /*Font Size overrided for the bug 115864 */
#footer .footer_row{ margin:0 0 5px 0; }
/* Added for the bug 115864 */
#footer .footer_row2{ margin:0; clear:both; float:right; padding: 10px 0; }
#footer .footer_row2 a { text-decoration: none; color: #000000; margin: 0 8px 0 0; }
#footer span.secure { /*margin-left: 14px; padding: 0; position: relative; top: -4px; z-index: 1;*/ float:right; }
/* Bug 115864 END */
#footer .margin_out{margin-left:-3px;}
#footer .footer_row a { /* Commented for 115864 - font-size: 12px;*/ color: #000; margin-right:8px; text-decoration: none; }
#footer .footer_row a.footer_rowend { margin-right:0; }
#footer .footer_row a:hover, #footerTest #footer .footer_row a.footer_rowend:hover { color: #D6A847; }
#foot_copyright { font-size: 11px; }
#footer .footer_row .social-icons { margin-left: 15px; float:right; } /* Float property added to make the social icon right positioned for the bug 115864 */

a.nounderline{text-decoration : none;}

/* WDR: for US/CA country switcher.  Tweak if needed please! */
/*
#header #alt-nav ul { display: inline; }
#header #alt-nav #country-switch { display: inline; margin-left: 30px; }
*/
#footer .footer_row  #country-switch { display: inline; margin: 0 30px; float: left; }
#footer .footer_row  #country-switch a { margin: 0; }
#footer .footer_row  #country-switch A:link {text-decoration: none; color:#7d998d !important}
#footer .footer_row  #country-switch A:visited {text-decoration: none; color:#7d998d !important}
#footer .footer_row  #country-switch A:hover {text-decoration: none; color: #D6A847 !important}


/*
 * Page bottom
 */

.region-bottom { /* Wrapper for any blocks placed in the page bottom region */
}

/*
*slider
*/
.ei-slider{
	position: relative;
	width: 960px;
	height: 300px;
	margin: 0 auto;
}
.ei-slider-loading{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index:999;
	background: rgba(0,0,0,0.9);
	color: #fff;
	text-align: center;
	line-height: 400px;
}
.ei-slider-large{
	height: 100%;
	width: 100%;
	position:relative;
	overflow: hidden;
	padding:0;
	margin:0;
	list-style: none outside none;
}
.ei-slider-large li{
	position: absolute;
	top: 0px;
	left: 0px;
	overflow: hidden;
	height: 100%;
	width: 100%;
}
.ei-slider-large li img{
	width: 100%;
}
.ei-title{
	position: absolute;
	right: 50%;
	margin-right: 13%;
	top: 30%;
}
.ei-title h2, .ei-title h3{
	text-align: right;
}
.ei-title h2{
	font-size: 40px;
	line-height: 50px;
	font-family: 'Playfair Display', serif;
	font-style: italic;
	color: #b5b5b5;
}
.ei-title h3{
	font-size: 70px;
	line-height: 70px;
	font-family: 'Open Sans Condensed', sans-serif;
	text-transform: uppercase;
	color: #000;
}
.ei-slider-thumbs{
	height: 13px;
	margin: 0 auto;
	position: relative;
	padding:0;
	margin:0;
	list-style: none outside none;
}
.ei-slider-thumbs li{
	position: relative;
	float: left;
	height: 100%;
}
.ei-slider-thumbs li.ei-slider-element{
	top: 0px;
	left: 0px;
	position: absolute;
	height: 100%;
	z-index: 10;
	text-indent: -9000px;
	background: #000;
	background: rgba(0,0,0,0.9);
}
.ei-slider-thumbs li a{
	display: block;
	text-indent: -9000px;
	background: #666 ;
	width: 100%;
	height: 100%;
	cursor: pointer;
	-webkit-box-shadow:
        0px 1px 1px 0px rgba(0,0,0,0.3),
        0px 1px 0px 1px rgba(255,255,255,0.5);
	-moz-box-shadow:
        0px 1px 1px 0px rgba(0,0,0,0.3),
        0px 1px 0px 1px rgba(255,255,255,0.5);
	box-shadow:
        0px 1px 1px 0px rgba(0,0,0,0.3),
        0px 1px 0px 1px rgba(255,255,255,0.5);
	-webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    -o-transition: background 0.2s ease;
    -ms-transition: background 0.2s ease;
    transition: background 0.2s ease;
}
.ei-slider-thumbs li a:hover{
	background-color: #f0f0f0;
}
.ei-slider-thumbs li img{
	position: absolute;
	bottom: 50px;
	opacity: 0;
	z-index: 999;
	max-width: 100%;
	-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    transition: all 0.4s ease;
	-webkit-box-reflect:
        below 0px -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(transparent),
            color-stop(50%, transparent),
            to(rgba(255,255,255,0.3))
            );
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.ei-slider-thumbs li:hover img{
	opacity: 1;
	bottom: 13px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

/** slider end */

/* front-bottom */
#front-bottom {
    height: 175px;
    position: relative;
		background-color:#f2f2f2;
}

.front-bottom-item {
	float:left;
	width: 240px;
	height:100%;
}

.front-bottom-item img {
	margin: 5px 3px 10px 3px;
}

/* end slide */

/*--------*/

.main_top_back {
	margin:0 auto;
	width:941px;
	background: url(../images/feature-content_bg.gif) repeat-x scroll left bottom transparent;
}

.browse-products {
	margin:10px 0;
}

.product-item {
	width:310px;
	margin-right:15px;
	float:left;
}

.product-item-pic {
	float:left;
}

.product-item-pic img {
	border: 1px solid #CCCCCC;
	width:150px;
	height:150px;
}

.product-content{
	float:left;
	width:158px;
}

.product-content-row{
	margin-left:7px;
	margin-bottom:5px;
}

.product-content a{
	color:#000;
}

.prod_price {
	color:#7C988D;
	font-size:13px;
	font-weight:bold;
}

.product-content a:hover, .product-content a:active{
	color: #D6A847;
}

#breadcrumb a {
    color: #326445;
    text-decoration: none;
		font-size:11px;
}

#breadcrumb a:hover, #breadcrumb a:active {
    color: #D6A847;
}

.new-prod-item {
	float:left;
	width: 480px;
}

.np-item-cont{
	float:left;
	width:242px;
	margin-top:72px;
}

.np-item-title{
	padding-bottom: 6px;
	FONT-FAMILY: 黑体;
	COLOR: #ed9d92;
	FONT-SIZE: 18px;
	line-height:normal;
}

.np-item-title-g{
	color:#a9d562;
	padding-bottom: 6px;
	FONT-FAMILY: 黑体;
	FONT-SIZE: 18px;
	line-height:normal;
}

.np-item-exp {
	PADDING-BOTTOM: 9px;
	FONT-FAMILY: 黑体;
	COLOR: rgb(0,0,0);
	FONT-SIZE: 16px;
	line-height:normal;
}

.np-item-body{
	LINE-HEIGHT: 15px;
	FONT-FAMILY: 宋体;
	COLOR: rgb(0,0,0);
	FONT-SIZE: 12px;
}

.np-item-view{
	margin-top:20px;
}

.np-item-img{
	float:left;
	width:238px;
}

.prod-img {
	width:250px;
	float:left;
}

.prod-view {
	width:500px;
	float:left;
	margin-left:40px;
}
.prod-cont {
	margin-bottom:20px;
	background:url(../images/feature-content_bg.gif) repeat-x scroll left bottom transparent;
}

.prod-cont-item {
	margin:10px 0;
}

.fivestar {
	color: #7C988D;
  font-size: 11px;
  font-weight: bold;
	margin-bottom:20px;
}


#classic-list {
	width:160px;
	float:left;
}

#classic-slider {
	float:left;
	padding-left:20px;
	margin-bottom:3px;
	width:740px;
	background:url(../images/dots-301.gif) no-repeat scroll left top transparent;
}

.classic_top {
	margin-bottom:20px;
	background: url(../images/feature-content_bg.gif) repeat-x scroll left bottom transparent;
}

#classic-left {
	float:left;
	width: 200px;
	margin-left:20px;
}

#classic-left-items {
	background: url(../images/light-green-gradient_bg.gif) repeat-x scroll left bottom transparent;
  border-bottom: 1px solid #CCCCCC;
  padding: 10px 7px;
}

.classic-left-item {
	border-bottom:#CCC 1px dotted;
	padding-top: 10px;
}

#classic-left-title {
    background: url(../images/accordion_toggle_bg.gif) repeat-x scroll left bottom transparent;
    border-bottom: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    display: block;
    margin: 0;
}

.classic-left-title2 {
    background: url(../images/accordion_toggle_bg.gif) repeat-x scroll left bottom transparent;
    border-bottom: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    display: block;
    margin: 0;
		padding:7px;
}


#classic-left-title a.ac {
	background: url(../images/accordion_icon_sprite.gif) no-repeat scroll right 4px transparent;
  cursor: pointer;
  display: block;
  font-size: 12px;
  padding: 5px;
	color:#326445;
}

#classic-left-title a.vc {
	background: url(../images/accordion_icon_sprite.gif) no-repeat scroll right -80px transparent;
}

#classic-left-cont {
	padding:7px 5px;
	background:#FFF;
}

.classic-left-img a{

	display:block;
	width: 75px;
	height: 75px;
}

.classic-left-img {
	float:left;
	width:75px;
	height:75px;
	border: 1px solid #CCC;
	margin-right:10px;
}

.class-left-item-cont {
	float:left;
	width:85px;
}

#count p {
	margin:0 0 5px 0;
	padding:0;
}



#count a {
	color:#326445;
}

#count a:hover, #count a:active {
    color: #D6A847;
}

div.hidden {
	display:none;
}

#classic-right {
	margin-left:40px;
	float:left;
}

#classic-right-top {
	margin-bottom:20px;
}

.classic-right-top-item {
	float:left;
	width:226px;
	height:186px;
}

.classic-right-top-item img {
	width:226px;
	height:186px;
	border:0;
}

#classic-bottom {
	margin-bottom:20px;
}

#classic-items {
	margin:0 auto;
	padding:30px;
	border-top:1px solid #CCC;
}

#classic-items-title {
	font-size:18px;
	margin-left:30px;
	margin-top:20px;
	line-height:30px;
}

.classic-item {
	float:left;
	width:300px;
	margin-bottom: 30px;
}

.classic-item-img img{
	border:1px solid #CCC;
}

.classic-item-img {
	float:left;
}

.classic-item-cont {
	float:left;
	width:125px;
	padding-left:5px;
}


#col-1 {
    float: left;
    padding: 0;
    width: 250px;
}

.trustmark_off {
    border-top: 1px solid #CCCCCC;
}

#com-header {
	border-bottom:1px solid #CCC;
	line-height:16.2px;
	color: #000;
}

#com-header-con {
	background: none repeat scroll 0 center transparent;
	padding: 11px 0 0;
	height: 27px;
	text-align: right;
	border-bottom: 0 none;
}

#com-header-title {
	color: #718B80;
  display: inline;
  float: left;
  font-family: Arial,Verdana,sans-serif;
  font-size: 12px;
 	font-weight: bold;
}

#com-header-view {
	color: #326445;
  font-size: 11px;
  font-weight: bold;
}

#com-header select {
	color: #000;
  font-size: 11px;
  line-height: 13px;
	border: 1px solid #9B9B9B;
	font-style: italic;
}

#com-cont {
	margin-bottom: 5px;
	line-height: 16.2px;
}

.com-item {
  border-bottom: 1px dotted #CCC;
  padding: 0;
	background: url(../images/background_Left.gif) repeat-y scroll 176px 0 transparent;
	background-position: 645px 0 !important;
}

.com-item-left {
	float:left;
	width:600px;
	padding: 10px 20px;
}

.com-item-right {
	float:left;
	padding: 20px;
}

.com-item-title {
	  color: #7C988D;
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 5px;
		line-height: 20px;
}

.com-item-body {
  font-size: 11px;
	line-height: 16px;
}

#comment-title {
	 background: none repeat scroll 0 0 transparent;
   border-bottom: 1px solid #CCCCCC;
   color: #000000;
   font-size: 19px;
   margin-bottom: 20px;
   text-transform: none;
	 padding: 10px 0 7px;
   text-align: left;
}

#comment {
	padding: 0 20px;
}

.product-comment label {
	color: #000;
  display: inline;
  font-size: 11px;
  font-style: normal;
}

.product-comment input, .product-comment textarea {
	border: 1px solid #CCC;
	color: #999;
  font-size: 10px;
}

.com-item-fivestar {
	line-height: 20px;
	margin-bottom:5px;
  font-size: 11px;
}

.com-item-created {
	margin-bottom:5px;
	color:#999;
	font-style:italic;
}

.prod-img {
	margin-top: 20px;
}

.accordion li {
	list-style: none outside none;
}

.accordion li h3 a {
    background: url(../images/arrow_right.png) no-repeat scroll left center transparent;
		color: #ADADAD;
    display: inline-block;
    padding: 0 0 0 15px;
    text-decoration: none;
}

.accordion li.active h3 a {
    background: url(../images/arrow_down.png) no-repeat scroll left center transparent;
}

.accordion .panel {
	margin-left: 14px;
}

.product-join-search {
	padding:10px 30px;;
	float: left;
	width:400px;
}

.form-text {
	border: 1px solid #999999;
  font-size: 11px;
  padding: 1px 0 1px 2px;
}

/* Greyscale
Table Design by Scott Boyle, Two Plus Four
www.twoplusfour.co.uk
----------------------------------------------- */

table.mytable {
	width: 100%;
	border-collapse: collapse;
	color: #555;
	background: #fff;}

.mytable td, .mytable th {border: 1px dotted #bbb;
padding: .5em;}

/* =links
----------------------------------------------- */

table.mytable a {padding: 1px;
text-decoration: none;
font-weight: bold;
background: transparent;}

table.mytable a:link {border-bottom: 1px dashed #ddd;
color: #000;}

table.mytable a:visited {border-bottom: 1px dashed #ccc;
text-decoration: line-through;
color: #808080;}

table.mytable a:hover {border-bottom: 1px dashed #bbb;
color: #666;}

/* =head =foot
----------------------------------------------- */

.mytable thead th, .mytable tfoot th {
	text-align: center;
	font-size: 1.2em;
	font-weight: bold;
	color: #333;
	background: transparent;
	padding: 30px 20px;
}

.mytable tfoot td {border: 2px solid #000;}

/* =body
----------------------------------------------- */

.mytable tbody th, .mytable tbody td {vertical-align: top;
padding: 30px 20px;
text-align: left;}

.mytable tbody th {white-space: nowrap;}

.mytable .odd {background: #fcfcfc;}

.mytable tbody tr:hover {background: #fafafa;}
label { margin-bottom: 5px;}

.best-product-item {
	float: left;
	width: 240px;
	height: 412px;
}

.cms-large-product {
	background-color: #E8EFEB;
    margin-bottom: 5px;
    padding: 5px;
    width: 220px;
    margin-left: 7px;
}

#best-page-slider {
	width: 963px;
	margin-bottom: 10px;
}

.best-pic {
  float: left;
  margin-bottom: 10px;
}

